@charset "UTF-8";
*{
  margin: 0;
  padding: 0;
  /*启用盒子模型，这样不会出现挤压的效果*/
  box-sizing:border-box;
}
html,body,.normal{
  height:100%;
  background-color: rgb(11, 18, 46);
  overflow: auto;
  color: #FFFFFF;
}


::-webkit-scrollbar-track{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);}/*滚动条的滑轨背景颜色*/
::-webkit-scrollbar-thumb{background-color: rgba(0,0,0,0.05);border-radius: 10px;-webkit-box-shadow: inset 1px 1px 0 rgba(75, 75, 75, 0.58);}/*滑块颜色*/
::-webkit-scrollbar-thumb{background-color: rgba(0,0,0,0.2);border-radius: 10px;-webkit-box-shadow: inset 1px 1px 0 rgba(48, 48, 48, 0.92);}
::-webkit-scrollbar{width: 16px;height: 16px;}/* 滑块整体设置*/
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb{border-radius: 999px;border: 5px solid transparent;}
::-webkit-scrollbar-track{box-shadow: 1px 1px 5px rgba(0,0,0,.2) inset;}
::-webkit-scrollbar-thumb{min-height: 20px;background-clip: content-box;box-shadow: 0 0 0 5px rgba(0,0,0,.2) inset;}
::-webkit-scrollbar-corner{background: transparent;}/* 横向滚动条和纵向滚动条相交处尖角的颜色 */

.normal{
  padding-top: 5px;
  padding-bottom: 5px;
}

.normal-top{
  height: 500px;
  div{
    height: 100%;
    .normal-section{
      height: 100%;
      width: 100%;
      //两侧表格分层
      //.normal-chart-bottom{
      //  width: 100%;
      //  height: 50%;
      //  //中间核心表格
      //  .mainChart{
      //    width: 100%;
      //    height: calc(100%);
      //  }
      //}
      .normal-chart-top{
        padding-top: 30px;
        padding-bottom: 30px;
        width: 100%;
        height: 100%;
        //中间核心表格
        .mainChart{
          width: 100%;
          height: calc(100% - 50px);
        }
      }
      //中间核心表格
      .mainChart{
        width: 100%;
        height: calc(100% - 50px);
      }
    }
  }
}

.normal-bottom{
  height: calc(100% - 500px);
  div{
    height: 100%;
    .normal-section{
      height: 100%;
      width: 100%;
      .normal-title{
        width: 100%;
        height: 35px;
        padding-top: 5px;
        padding-left: 10px;
      }
      .normal-content{
        width: 100%;
        height: calc(100% - 35px);
        overflow: auto;
        padding-top: 4px;
        //表格
        table{
          height: 100%;
          width: 100%;
          tbody {
            display: table-row-group;
            vertical-align: middle;
            border-color: inherit;
            tr:nth-child(2n+1) {
              background-color: #072951;
              box-shadow: -10px 0px 15px #034c6a inset,
              10px 0px 15px #034c6a inset;
            }
          }
        }

        //图形
        #faultChart{
          height: 100%;
          width: 100%;
        }
      }
    }
  }
}

//边框样式
.normal-border-style{
  background: linear-gradient(to left,#3897cf,#3897cf) left top no-repeat,
  linear-gradient(to bottom,#3897cf,#3897cf) left top no-repeat,
  linear-gradient(to left,#3897cf,#3897cf) right top no-repeat,
  linear-gradient(to bottom,#3897cf,#3897cf) right top no-repeat,
  linear-gradient(to left,#3897cf,#3897cf) left bottom no-repeat,
  linear-gradient(to bottom,#3897cf,#3897cf) left bottom no-repeat,
  linear-gradient(to left,#3897cf,#3897cf) right bottom no-repeat,
  linear-gradient(to left,#3897cf,#3897cf) right bottom no-repeat;;
  background-size: 1px 20px,20px 1px,1px 20px,20px 1px;
  background-color: rgba(0,0,0,.3);
  border: 2px solid #2b3a6a;
}

.ratio_detail_table {
  width: 200px;
  margin: auto;
  margin-top: -60px;
  padding: 5px;
  box-shadow: 5px 5px 0 lightgrey;
  background-color: lightskyblue;
}
.green {
  background-color: green;
  color: white;
}
.red {
  background-color: red;
  color: white;
}